11

下一篇:【译】《精通使用AngularJS开发Web App》(二)

原版书名:Mastering Web Application Development with AngularJS

Chapter 1

第一章 Angular之道

这一章主要是介绍AngularJS,包括这个框架以及它背后的项目。首先我们先大概看看这个项目本身:谁在更新代码,到哪里去找源码和文档,如何寻求帮助等等。

本章的大部分内容用来介绍AngularJS框架,它的核心概念,编码模式。这会覆盖到很广泛的内容,为了让学习的过程更快更轻松,书中会提供大量的代码示例。

AngularJS是一个独特的框架,毫无疑问会在未来几年内对web开发领域产生重大影响。所以会在本章最后一部分来解释是什么让AngularJS如此的与众不同,与其他现有的框架任何比较,它下一阶段的规划。

本章中我们会涵盖以下一个话题:
- 怎么用AngularJS来写一个Hello World应用。在写的过程中,你会了解到到哪里去找框架的源码,文档和社区。
- 逐渐熟悉构建任何AngularJS应用的基础构建:有指令的模板,scopes(作用域)和controllers(控制器)。
- 了解AngularJS复杂又强大的依赖注入系统
- 该如何比较AngularJS和其他框架和库(尤其是jQuery),是什么让他与众不同。

遇见AngularJS

AngularJS是用javascript写的客户端 MVC 框架,它运行在浏览器中,并极大的帮助我们(开发者)书写现代的、单页的、AJAX风格的web App。这是一个通用的框架,但当你用来开发CRUD(创建 读取 更新 删除)类型的web app时更能显现出它的强大之处。

熟悉框架

AngularJS是客户端MVC框架的一个新丁,但它已经吸引了极大的关注,主要是因为它革命性的模板系统,易于开发,还有非常坚实的工程实践。的确,他的模板系统在于多方面都是独一无二的:
- 它使用HTML作为模板语言
- 它并不需呀显示的DOM刷新,因为AngularJS能够跟踪用户的动作,浏览器的事件,并能在模型被改变后指出哪个模版需要在何时刷新。
- 它还有一个有意思而且扩展性很强的组件子系统,它还能教会浏览器如何理解一些新的HTML标签和属性。

模板子系统可能是最易被看到的部分,但也别误解以为AngularJS就是一个囊括了一些工具和单页web App经常用到的服务的集合。

AngularJS还有一些隐藏的财富,依赖注入(DI)还有很强的可测试性。对依赖注入的内置支持使得从更小更彻底的测试过服务中组装一个web App更容易。框架的设计和它周边的工具集都提倡并推广在开发的每一个阶段都使用测试惯例。

找到你需要的方式

AngularJS在客户端MVC框架的舞台上相对来说还是一个新人;它的1.0的版本在2012年6月才发布,这个框架的工作开始于2009年,起初是Miško Hevery的一个个人项目,作者是Google的员工。最初的想法确实非常棒,在编码期间,项目被Google正式的收纳。现在在Google有一整个团队全日制的维护更新这个框架。

AngularJS是一个开源项目,放在Github上([https://github.com/ angular/angular.js]https://github.com/ angular/angular.js),并由Google采用MIT方式授权。

社区

时至今日,离开社区的支持,任何一个项目都无法存活下去。幸运的是,AngularJS拥有一个活跃的,支持度高的社区。下面是一些交流频道,可以用来讨论设计,提问求助:
- angular@googlegroups.com 邮件列表(Google小组)
- Google+ 在 https://plus.google.com/u/0/communities/115368820700870330756
- #angularjs IRC 频道
- 在 http://stackoverflow.com 上的 [angularjs] 标签
AngularJS团队通过维护一个博客(http://blog.angularjs.org/)来跟社区保持联系,还有一些社交媒体,Google + (+ AngularJS),还有 Twitter( @angularjs)。同时还有世界各地举办的社区见面会;如果哪次正好在你周边举行,当然是很值得去参加的。

线上学习资源

AngularJS有自己专用的网站(http://www.angularjs.org),在这里我们可以找到关于一个体面的框架所应该有的所有的一切:概念概览,教程,开发者指南,API参考等等。AngularJS已发布的所有的版本都可以从http://code.angularjs.org下载。

想找示例代码的人也不会失望,因为AngularJS文档中有大量的代码片段。另外,还可以浏览一系列的使用AngularJS开发的应用的列表(http://builtwith.angularjs.org)。YouTube上还有一个专门的频道(http://www.youtube.com/user/angularjs),有一些过往的录音,还有一些有用的视频教程。

库和扩展

AngularJS 核心功能强大丰富,同时,活跃的社区几乎每天都在增添新的扩展。这其中的一大部分都可以在这个专门的网站上找到:http://ngmodules.org

工具

AngularJS 构建在 HTML 和 JavaScript 之上,这两个技术已经被用在Web开发上许多年了。正因为此,我们依旧可以使用我们所熟悉的编译器和IDE,浏览器扩展,等等,毫无问题。
另外,AngularJS社区还为已经存在的HTML/JavaScript工具箱里贡献了许多有意思的工具。

Batarang

Batarang是一个Chrome开发者工具的扩展,可以用来检视AngularJS Web应用。Batarang可以非常方便的以图形化的方式来检查分析 AngularJS 应用的运行性能等情况。我们在本书中将会广泛的使用它,可以对运行中应用后台的情况一览无余。Batarang就像其他的Chrome扩展一样,可以在Chrome的Web Store(商店)(AngularJS Batarang)中下载安装。

Plunker and jsFiddle

无论是Plunker(http://plnkr.co)还是jsFiddle(http://jsfiddle.net)可以非常方便的分享一些代码片段(JavaScript,CSS 和 HTML),尽管这些工具并不是专为 AngularJS 定制的,但是非常迅速的就被 AngularJS 社区所采用了,用来分享一些小的示例代码,Bug的情景重现等等。Plunker理应得到特别的关注,因为他就是用 AngularJS 来写的,而且在社区中也是一个非常流行的工具。

IDE extensions and plugins

我们每个人都有自己喜欢的编辑器或IDE。好消息是已经有许多款可以适用于非常流行的IDE的插件/扩展了,比如Sublime Text2(https://github.com/angular-ui/AngularJS-sublime-package),Jet Brains的系列产品(http://plugins.jetbrains.com/plugin?pr=idea&pluginId=6971)等等。

转载请注明来自[超2真人]
本文链接:http://www.peichao01.com/static_content/doc/html/Mastering_Web_Application_Development_with_AngularJS_1.html


超2真神
1.1k 声望104 粉丝

关注设计、漫画、动画,前端、javascript、iOS还有任何好玩的事情